<template>
  <div>
    <h1>接机单</h1>

    <el-table v-loading="loading" :data="pickAirportList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="接机订单id" align="center" prop="pickairportId" />
      <el-table-column label="用户" align="center" prop="uname" />
      <el-table-column label="用户手机号" align="center" prop="userTel" />
      <el-table-column label="订单号" align="center" prop="orderCard" />
      <el-table-column label="航班号" align="center" prop="flightNumber" />
      <el-table-column label="航站楼信息" align="center" prop="terminalInformation" />
      <el-table-column label="机场名称" align="center" prop="startPoint" />
      <el-table-column label="目的地" align="center" prop="destination" />
      <el-table-column label="距离" align="center" prop="distance" />
      <el-table-column label="上车时间" align="center" prop="gocarTime" width="180">
        <template #default="scope">
          <span>{{ parseTime(scope.row.gocarTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="结束时间" align="center" prop="endTime" width="180">
        <template #default="scope">
          <span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="预估价格" align="center" prop="predictPrice" />
      <el-table-column label="实际价格" align="center" prop="realPrice" />
      <el-table-column label="订单状态" align="center" prop="orderStatus" >
        <template #default="{row}">
          <span v-if="row.orderStatus == 1">待接单</span>
          <span v-if="row.orderStatus == 2">已接单/待上车</span>
          <span v-if="row.orderStatus == 3">已上车</span>
          <span v-if="row.orderStatus == 4">待支付</span>
          <span v-if="row.orderStatus == 5">已支付/已结束/待评价</span>
          <span v-if="row.orderStatus == 6">已评价</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button link type="primary" icon="Edit" @click="tonavignin(scope.row)" v-show="scope.row.orderStatus==2">完成订单</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup name="airport">

import { useRouter } from "vue-router";

import {findAll, getPickAirport, listPickAirport} from "@/api/pickAirport/pickAirport.js";

const { proxy } = getCurrentInstance();


const router = useRouter();
const pickAirportList = ref([]);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    userTel: null,
    flightNumber: null,
    terminalInformation: null,
    startPoint: null,
    destination: null,
    distance: null,
    gocarTime: null,
    endTime: null,
    predictPrice: null,
    realPrice: null,
  },
  rules: {
  }
});

const { queryParams, form, rules } = toRefs(data);

/** 查询接机订单列表 */
function getList() {
  loading.value = true;
  findAll(queryParams.value).then(response => {
    pickAirportList.value = response.data.rows;
    total.value = response.data.total;
    loading.value = false;
  });
}

/** 修改按钮操作 */
function handleUpdate(row) {

}

function tonavignin(row){
    router.push({path: '/driver/navign/navign',query:{start: row.startPointLongitude+","+row.startPointLatitude,end: row.destinationLongitude+","+row.destinationLatitude,orderCard:row.orderCard+"_2"}})
}


getList()
</script>
